<?php 
session_start();
?><!DOCTYPE html>
<html>
<head>
<title>周生生</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
<meta name="apple-mobile-web-app-capable" content="yes"/>
<meta name="full-screen" content="true"/>
<meta name="screen-orientation" content="portrait"/>
<meta name="x5-fullscreen" content="true"/>
<meta name="360-fullscreen" content="true"/>
<link rel="stylesheet" type="text/css" href="css/animate.min.css">
<link rel='stylesheet' href='css/sweet-alert.css' />
<style>
html,body{background-color:#a0a0a2;}
body,div{margin:0px;padding:0px;margin:0px auto;}
body, h1, h2, h3, h4, a{ font-family:'MHeiPRC-Bold', '微软雅黑', 'Microsoft YaHei';}
div,img{-webkit-tap-highlight-color:rgba(0,0,0,0);}
* {-webkit-text-size-adjust: none;}
img,input, button{ -webkit-appearance: none; background: none; padding: 0; outline-style:none; border: none; }
.clear{clear:both;}
img{border:none;} .gbrel{position: relative;width:100%;margin:0px auto;}
.gwimg img{width:100%;} .gleft{float:left;} .gright{float:right;}
.container{position:relative;margin:0px auto;width:768px;height:960px;opacity:0;}
.p1, .p2{position:absolute;width:100%;height:100%;}
.p1{background: transparent url('./images/p1.jpg') no-repeat top center;background-size: cover;}
.t1{position:absolute;width:378px;height:146px;background:transparent url('images/p1-t1.png') no-repeat;background-size:cover;right:34px;opacity:0;}
.t2{position:absolute;width:220px;height:57px;background:transparent url('images/p1-t2.png') no-repeat;background-size:cover;left:44px;top:865px;opacity:0;}
.t3{position:absolute;width:86px;height:72px;background:transparent url('images/logo.png') no-repeat;background-size:cover;left:644px;top:860px;opacity:0;}
.arrow{position:absolute;width:23px;height:23px;-webkit-animation:abounce 2s infinite;background:transparent url('images/arrow.png') no-repeat;background-size:cover;right:30px;top:480px;display:none;}
.p-in{-webkit-transform:translate(0,0) scale(1,1);opacity:1;}
.start{position:absolute;display:block;top:855px;right:308px;display:none;}
.p2{background:transparent url('./images/p23.jpg') no-repeat top center;background-size:cover;display:none;}
.p2 input{position:absolute;display:block;color:#695e57;z-index:9;}
.p2 #name{width:190px;height:40px;top:570px;left:262px;}
.p2 #shenga{width:52px;height:30px;top:640px;left:438px;text-align:center;}
.p2 #shengb{width:60px;height:30px;top:640px;left:496px;text-align:center;}
.p2 #phone{width:180px;height:35px;top:626px;left:260px;}
.p2 #address{width:280px;height:35px;top:745px;left:262px;}
.dota, .dotb{position:absolute;width:19px;height:20px;top:530px;}
.dota img, dotb img{width:100%;}
.dota{left:207px;}
.dotb{left:299px;}
.t21{right:69px;top:800px;}
.p2 .submit{position:absolute;width:350px;height:70px;top:740px;left:208px;}
@media (orientation: landscape){.henpin{display:block;display:none;position:absolute;width:100%;height:1024px;background-image: url(images/shun.png);background-size:auto 100%;background-position:center center;background-color:black;background-repeat:no-repeat;z-index:5000;}}
@media (orientation: portrait){.henpin{display:none;}}
@-webkit-keyframes abounce {
    0%{-webkit-transform: translate3d(-3px,0, 0);opacity:.8;}
    25%{-webkit-transform: translate3d(0,0, 0);}
    50% {-webkit-transform: translate3d(3px, 0, 0);opacity:.5;}
    75% {-webkit-transform: translate3d(0, 0, 0);}
    100% {-webkit-transform: translate3d(-3px,0,0);opacity:.8;}
}
</style>
</head>
<body><div class="henpin"></div>
<div class="container">
   <div class="p1">
	    <div class="t1"></div>
		<div class="t2"></div>
		<div class="t3"></div>
		<img class="start" src="images/b3.png" />
   </div>
   <div class="p2 animated zoomIn">
            <div class="dota"><img src="images/a.png"></div> 
            <div class="dotb"><img src="images/b.png"></div>
            <div class="t21"></div>
            <input type="text" id="name" name="name" value="" />
            <input type="text" id="phone" name="phone" value="" />
            <div class="submit"></div>
   </div>
</div>
<script src="http://libs.baidu.com/jquery/1.9.1/jquery.min.js"></script>
<script src="js/velocity.min.js"></script>
<script src="js/velocity.ui.min.js"></script>
<script src="js/pxloader-images.min.js"></script>
<script src="js/sweet-alert.min.js"></script>
<script>
var loader = new PxLoader();
var _img=['p1.jpg'];
for(var i=0; i<_img.length; i++){loader.addImage('images/'+_img[i]);}
for(var i=1; i<=15; i++){loader.addImage('images/b'+i+'.png');}
loader.start();
loader.addCompletionListener(function() { 
	$(".container").animate({ opacity: 1 });
	$('.t1').velocity({top:[88, 60], opacity:1}, {delay:400,duration: 500 });
	$('.t2').velocity({width:[220, 0], opacity:1}, {delay:900,duration: 500 });
	$('.t3').velocity({width:[86, 0], opacity:1}, {complete:function(){
		$('.t4').addClass("p-in");
		window.setTimeout(function(){
	    	$('.start').show();
	    	_bo();
		    }, 400);
		},delay:1400,duration: 500 });
}); 
var _j=1;
var _work=true;
function _bo(){
	_j++;
    if(_j>15){
    	_j=1;
     }
    $('.start').attr("src", "images/b"+_j+".png");
    if(true == _work){
	   window.setTimeout(function(){_bo();}, 200);
    }
}
$("#shenga").click(function(){
	if('月' == $("#shenga").val()){
		$("#shenga").val("");
    }
	if('日' == $("#shengb").val()){
		$("#shengb").val("");
    }
});
$("#shengb").click(function(){
	if('月' == $("#shenga").val()){
		$("#shenga").val("");
    }
	if('日' == $("#shengb").val()){
		$("#shengb").val("");
    }
});
var _yue=_ri=true;
$("#shenga").on('keypress keydown keyup', function(evt) {
	if(false == _yue){
		_yue=true;
		return;
	}
    if ($("#shenga").val().length > 1) {
    	$("#shengb").focus();
    	if('日' == $("#shengb").val()){
    		$("#shengb").val("");
        }
    	_yue=false;
    }
});
$("#shengb").on('keypress keydown keyup', function(evt) {
	if(false == _ri){
		_ri=true;
		return;
	}
    if ($("#shengb").val().length > 1) {
    	$("#phone").focus();
    	_ri=false;
    }
});
$(function(){
    var _canShow=true;
    $(".p1").click(function(){
    	  $(".p2").show();
	          $('.t21').addClass("p-in");
	      _canShow=false;
	      _work=false;
     });
    var _gender='lady';
    $(".dota").click(function(){
    	_gender='lady';
    	$(".dota img").attr("src", "images/a.png");
    	$(".dotb img").attr("src", "images/b.png");
     });
    $(".dotb").click(function(){
    	_gender='man';
    	$(".dota img").attr("src", "images/b.png");
    	$(".dotb img").attr("src", "images/a.png");
     });
    $(".submit").click(function(){
    	var _name=$("#name").val();
    	var _yue=$("#shenga").val();
    	var _ri=$("#shengb").val();
		var _phone=$("#phone").val();
		var _address=$("#address").val();
		var _bao=$("#bao").val();
		 if('' == _name){
			 swal("请填写您的姓名!"); 
			 return false;}
		 if('' == _yue || '' == _ri){
			 swal("请填写您的生日!");
			 return false;}
		 if('' == _phone){
			 swal("请填写您的手机号!");
			 return false;}
		 if(_phone.substring(0,1)  != 1){
				swal("请填写正确电话号码!");
				return false;
		  }
		 if(_phone.length  != 11){
				swal("请填写正确电话号码!");
				return false;
			}
		 if('' == _address){
			 swal("请填写地址!"); 
			 return false;}
		 if('' == _bao){
			 swal("请填写保单号!"); 
			 return false;}
		 $.post("user.php", { name:_name, gender:_gender,yue:_yue, ri:_ri, phone:_phone, address:_address, bao:_bao},
			function(data){
			   if('exit' == data){
				   swal("您输入的手机号码已被使用过!"); 
				   return false;
			   }else{
			   window.location.href="show.php?p="+data;
			   }
		 });

     });
    
    
});
</script>
</body>
</html>
